<template>
  <div class="intelligent-quality-check">
    <el-tabs  v-model="activeName" @tab-click="tabChange">
      <el-tab-pane :label="$t('qualityCheck.'+ item.label)" v-for="(item, index) in tabPanes" :name="item.name" :key="index">
      </el-tab-pane>
    </el-tabs>
    <keep-alive>
      <router-view></router-view>
    </keep-alive>
  </div>
</template>
<script>
  import {isHasMenu} from '@/utils/m7Utils'
  import { addZhuGeTrack } from '@/utils/addZhuGeTrack.js'
  export default {
    name: 'qualityCheck',
    data () {
      return {
        activeName: 'quality_check'
      }
    },
    computed: {
      tabPanes () {
        let data = [
          {name: 'quality_check', label: 'qualityCheck', fun: 'func_autoqc'},
          {name: 'quality_check_result', label: 'qualityCheckResult', fun: 'func_autoqc_result'}
        ]
        let tabPanesData = []
        data.forEach(item => {
          if (isHasMenu(item.fun, this.$store.state.session.user)) {
            tabPanesData.push(item)
          }
        })
        return tabPanesData
      }
    },
    watch: {
      '$route' (to, form) {
        if (to.fullPath.split('/')[3] === 'quality_check_result') {
          this.activeName = 'quality_check_result'
        }
      }
    },
    methods: {
      tabChange (tab) {
        addZhuGeTrack('/index/intelligentQualityCheck/' + tab.name)
        this.$router.push({ path: '/index/intelligentQualityCheck/' + tab.name })
      }
    },
    beforeMount () {
      let pathArr = this.$route.fullPath.split('/')
      if (pathArr.length === 3) {
        this.activeName = this.tabPanes[0].name
        this.$router.push({path: '/index/intelligentQualityCheck/' + this.tabPanes[0].name})
      } else {
        this.activeName = pathArr[3]
        this.$router.push({path: '/index/intelligentQualityCheck/' + pathArr[3]})
      }
    },
    activated () {
      if (this.$route.path.split('/').length === 3) {
        this.activeName = this.tabPanes[0].name
        this.$router.push({path: '/index/intelligentQualityCheck/' + this.tabPanes[0].name})
      }
    }
  }
</script>
<style lang="stylus" scoped>
@import "../../../assets/common.styl"
  .intelligent-quality-check
    height calc(100vh - 52px)
    background $cf-white
</style>
